<template>
	<view class="select_project_address">
		<view class="form-list">
			<!-- <view class="form-item" v-if="needSheQu && needSheQu == 'true'"> -->
			<view class="form-item">
				<view class="form-label">
					社区、村
				</view>
				<view class="form-value">
					<input class="form-input" :value="orgName" disabled placeholder="请选择社区、村"
						@click="onPopShow(true)" />
				</view>
			</view>

			<view class="form-item">
				<view class="form-label">
					区域，组，宅基
				</view>
				<view class="form-value">
					<input v-model="form.Region" class="form-input" />
				</view>
			</view>

			<view class="form-item">
				<view class="form-label">
					路，街，巷
				</view>
				<view class="form-value">
					<input v-model="form.Road" class="form-input" />
				</view>
			</view>

			<view class="form-item">
				<view class="form-label">
					号（幢）
				</view>
				<view class="form-value">
					<input v-model="form.HouseNO" class="form-input" />
				</view>
			</view>

			<view class="form-item">
				<view class="form-label">
					房屋或单位名称
				</view>
				<view class="form-value">
					<input v-model="form.Name" class="form-input" />
				</view>
			</view>
			<view v-if="pageType > 0" class="form-item">
				<view class="form-value">
					<van-checkbox icon-size="28rpx" :value="form.bApply" shape="square" @change="onBApplyChange">
						是否备案
					</van-checkbox>
				</view>
			</view>
			<view class="form-item">
				<van-button type="info" round block size="small" style="width: 100%;box-sizing: border-box;"
					@click="toQuery">
					查询
				</van-button>
			</view>
		</view>
		<view class="address-container">
			<view class="address-item" v-for="(item, index) in addressList" :key="index">
				<view class="item-left">
					<view>
						房屋或单位名称：{{ item.address }}
					</view>
				</view>
				<view class="item-right">
					<van-button size="mini" type="info" @click="selectAddress(item)">
						选择
					</van-button>
				</view>
			</view>
		</view>

		<van-popup :show="popShow" position="bottom" @close="onPopShow(false)">
			<van-picker show-toolbar title="社区、村" :columns="orgList" @cancel="onPopShow(false)" value-key="name"
				@confirm="onPopConfirm" />
		</van-popup>
	</view>
</template>

<script>
	import {
		getOrg,
		searchAddress
	} from '@/request/api.js'
	export default {
		data() {
			return {
				pageAll: false, // false 需要传account true 不需要传account
				pageType: 0, // 0 普通模式, 1是否备案模式
				orgList: [],
				orgName: '',
				popShow: false,
				form: {
					Region: '', // 区域
					Road: '', // 路街道巷
					HouseNO: '', // 号（幢）
					Name: '', // 房屋名称
					orgid: ''
				},
				addressList: [],
				needSheQu: true,
				proForm: {}
			};
		},
		onLoad(e) {
			this.proForm = uni.getStorageSync('SafeCheckForm')
			console.log(this.proForm)

			getOrg().then(res => {
				this.orgList = res.result
			})

			this.pageType = e.pageType
			this.pageAll = e.pageAll == 'true' || e.pageAll == 'false' ? e.pageAll : false
			this.needSheQu = e.needSheQu == 'true' || e.needSheQu == 'false' ? e.needSheQu : true

			if (e.pageType > 0) {
				this.$set(this.form, 'bApply', true)
			}
			if (!this.pageAll) {
				uni.getStorage({
					key: 'userInfo',
					success: (res) => {
						const account = res.data[0].account
						this.form.Account = account
					}
				})
			}
		},
		methods: {
			onBApplyChange(e) {
				this.$set(this.form, 'bApply', e.detail)
				// this.form.bApply = e.detail
			},

			selectAddress(item) {
				if (this.form.bApply) {
					item.bApply = true
				}
				uni.$emit('handleSelectAddress', item)
				uni.navigateBack({
					delta: 1
				})
			},

			toQuery() {
				const queryObj = {
					...this.form
				}

				if (this.pageType > 0) {
					queryObj.bApply = (queryObj.bApply) ? 1 : 0
				}

				searchAddress(queryObj).then(res => {
					this.addressList = res.result
				}).catch(e => {
					console.error(e)
				})
			},

			onPopShow(flag) {
				this.popShow = flag;
			},

			onPopConfirm(e) {
				this.orgName = e.detail.value.name;
				this.$set(this.form, 'orgid', e.detail.value.id)
				this.onPopShow(false, null);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.select_project_address {
		padding: 32rpx;
		box-sizing: border-box;

		.address-container {
			.address-item {
				display: flex;
				align-items: center;
				margin-bottom: 32rpx;

				.item-left {
					flex: 1;
					font-size: 24rpx;
					display: flex;
					flex-wrap: wrap;

					view:nth-child(-n+2) {
						margin-top: 0;
					}

					view {
						// width: 50%;
						margin-top: 16rpx;
					}
				}

				.item-right {}
			}
		}

		.form-list {
			.form-item {
				display: flex;
				align-items: center;
				justify-content: center;
				margin-bottom: 32rpx;

				.form-label {
					width: 200rpx;
					margin-right: 32rpx;
					font-size: 28rpx;
					color: #141414;
				}

				.form-value {
					font-size: 28rpx;
					color: #141414;
					flex: 1;
					width: 0;
					display: flex;
					align-items: center;

					.form-input {
						padding: 0rpx 10rpx;
						box-sizing: border-box;
						border: 1px solid #CECECE;
					}
				}
			}
		}
	}
</style>
